import { Component } from '@angular/core';
import { NzButtonModule } from 'ng-zorro-antd/button';
import { NzFlexModule } from 'ng-zorro-antd/flex';

@Component({
  selector: 'app-flex-wrap',
  standalone: true,
  imports: [NzFlexModule, NzButtonModule],
  template: `
    <div class="demo" style="overflow-x: auto;">
      <div nz-flex nzGap="large" nzWrap="wrap-reverse">
        @for(button of buttons; track $index) {
        <button nz-button nzType="primary" nzSize="large">
          Button {{ button }}
        </button>
        }
      </div>
    </div>
  `,
})
export class FlexWrapComponent {
  buttons = Array.from({ length: 20 }, (_, i) => i + 1);
}
